// ==UserScript==
// @name         book_sticker_print
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       icdcom
// @match        http://172.16.6.200/ts/admin/books/sb_print.asp*
// @grant        all
// ==/UserScript==

(function () {
    'use strict';

    const itemPerRow = 4;
    const rowPerPage = 10;

    const wrap = document.querySelector(".main_print");
    const sb1 = document.querySelectorAll(".sb1");
    const sb = document.querySelectorAll(".sb");
    const sb2 = document.querySelectorAll(".sb2");
    const headStyle = document.querySelector("head style");

    var stickerArr = [];
    var pageArr = [];
    var rowArr = [];

    function createPageEl() {
        let pEl = document.createElement("div");
        pEl.setAttribute("class", "page");

        return pEl;
    }

    function createRowEl() {
        let rEl = document.createElement("div");
        rEl.setAttribute("class", "row");

        return rEl;
    }

    (function reset() {
        headStyle.innerText = `
        @media print
        {
            .main11{ display:none}
            .main_print { border:none;}
        }
        `;

        [sb1, sb, sb2].forEach((v) => {
            v.forEach((v, i, a) => {
                v.setAttribute("class", "sticker");
                stickerArr.push(v);
            });
        });

        wrap.innerHTML = "";
    })();

    headStyle.insertAdjacentHTML("afterend", `
        <style>
            .page{
                padding-top: 20px;
                padding-bottom: 20px;
                page-break-after: always;
                border: 1px solid #666;
            }
            .row{
                border: 1px dotted blue;
                text-align:center;
            }
            .sticker{
                text-align: center;
                border: 1px dashed red;
                display: inline-block;
            }
            .sticker .sb_1{
                margin: 0;
            }
            /*.page:last-of-type{
                border-bottom: none;
            }
            .page .row:last-of-type{
                border-bottom:none;
            }
            .row .sticker:last-of-type{
                border-right:none;
            }*/
            @media print
            {
                .page,.row,.sticker{border:hidden;}
            }
        </style>
    `);

    let totalPage = stickerArr.length % 40 > 0 ? parseInt((stickerArr.length / 40)) + 1 : stickerArr.length / 40;
    let totalRow = stickerArr.length % 4 > 0 ? parseInt((stickerArr.length / 4)) + 1 : stickerArr.length / 4;

    for (let i = 0; i < totalPage; i++) {
        let pEl = createPageEl();
        pageArr.push(pEl);
        wrap.append(pEl);
    }

    for (let i = 0; i < totalRow; i++) {
        let rEl = createRowEl();
        rowArr.push(rEl);
    }

    let pPointer = 0;
    rowArr.forEach((v, i, a) => {
        pageArr[pPointer].append(v);
        if (i + 1 == 10 && (i + 1) % 10 == 0) {
            pPointer++;
        }
    });

    let rPointer = 0;
    let stickerInx = 0;
    let rowInx = 0;
    stickerArr.forEach((v, i, a) => {
        rowArr[rPointer].appendChild(v);
        v.setAttribute("class", `${v.getAttribute("class")} sticker-${stickerInx}`);
        stickerInx++;

        // Row start
        if (i % 4 == 1) {
            let r = rowArr[rPointer];
            r.setAttribute("class", `${r.getAttribute("class")} row-${rowInx}`);
            rowInx++;
        }

        // Page end
        if (i > 0 && (i + 1) % 40 == 0) {
            stickerInx = 0;
            rowInx = 0;
        }

        // Row end
        if (i > 0 && (i + 1) % 4 == 0) {
            rPointer++;
        }
    });

})();